Glasgow | Jan-26 | Elisabeth Matulian | Sprint 1 | Wireframe #939

Elisabeth-Matulian · 2026-01-10T15:00:15Z

Learners, PR Template

Self checklist

I have titled my PR with Region | Cohort | FirstName LastName | Sprint | Assignment Title
My changes meet the requirements of the task
I have tested my changes
My changes follow the style guide

Changelist

I arranged the blocks according to the provided template. I fixed the footer at the bottom of the page and filled the blocks with articles.

Questions

Needs review

netlify · 2026-01-10T15:02:40Z

✅ Deploy Preview for cyf-onboarding-module ready!

Name	Link
🔨 Latest commit	`7dc1e66`
🔍 Latest deploy log	https://app.netlify.com/projects/cyf-onboarding-module/deploys/697162b3bcbc84000831ea44
😎 Deploy Preview	https://deploy-preview-939--cyf-onboarding-module.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	2 paths audited Performance: 100 (no change from production) Accessibility: 100 (no change from production) Best Practices: 100 (no change from production) SEO: 86 (no change from production) PWA: - View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify project configuration.

jenny-alexander

Hey @Elisabeth-Matulian 👋🏻 - you've added some good content to your wireframe exercise! I left a few suggestions for you to make in order to enhance your code submission.

jenny-alexander · 2026-01-18T21:05:49Z

Wireframe/index.html

+        more</a>
+    </article>
+    <article>
+      <img src="placeholder.svg" alt="" />


Can you add an image related to the article topic?

jenny-alexander · 2026-01-18T21:05:54Z

Wireframe/index.html

+      <a href="https://www.productplan.com/glossary/wireframe/">Read more</a>
+    </article>
+    <article>
+      <img src="placeholder.svg" alt="" />


Can you add an image related to the article topic?

jenny-alexander · 2026-01-18T21:06:06Z

Wireframe/index.html

+  </header>
+  <main>
+    <article>
+      <img src="placeholder.svg" alt="" />


Can you add an image related to the article topic?

jenny-alexander · 2026-01-18T23:38:35Z

Wireframe/index.html

+  </main>
+  <footer>
+    <p>
+      This is the default, provided code and no changes have been made yet.


💭 Perhaps you could add a little bit of information to the footer. This could be:

contact email address or link

a few social links to CYF

a copyright notice like '© 2026 [Name]'

Thanks for your review. Could you check the changes I made? :)

jenny-alexander

🙂 The wireframe is looking much better now - thanks for making those changes.
You have made good use of the alt attribute within the <image> tag to provide meaningful text to screen readers.

Here are some areas to improve:

I see a few styling issues:
- the article titles do not quite line up
- the Read more buttons are not the same size.

Files in PR:
- Addition of files:
  - Are any of the files within the /wireframe examples_files directory used? If not, the entire directory should be removed from the PR.
  - Is the wireframe examples.html file used? If not, it should be removed.
- Deletion of file:
  - The placeholder.svg file is a part of this exercise and it should not be deleted by your PR. Can you please undo this?

jenny-alexander · 2026-01-19T20:36:14Z

Wireframe/index.html

+      <a href="https://git-scm.com/book/en/v2/Git-Branching-Branches-in-a-Nutshell">Read more</a>
+    </article>
+  </main>
+  <footer>


Your footer is looking better now. However, I see a few issues that should be fixed.

Since you are using <li> elements, the default will show a bullet point. Can you find a way to ensure that those bullet points are not displayed?

The exercise instructions say: "The page footer is fixed to the bottom of the viewport." Right now, when I scroll up and down on your webpage, the footer is not fixed. If you aren't sure what a fixed footer is, here is a good example from W3Schools.

Thanks for your helpful feedback. I’ve made changes but I'm not sure if I correctly understand the way the footer should look.

I’d really appreciate it if you could take another look and let me know if everything looks good now.

Thanks again for your guidance.

@Elisabeth-Matulian - I had a look at your footer and I think there are a few opportunities to improve it.

I took a video recording for you to see what I mean. I also added an orange background colour to it. You can see that your footer isn't spanning the entire width of the screen.
Can you make changes to:
1 - Add a background color so the user can always see your footer?
2 - Ensure that the footer takes up the entire width of the page?

Screen.Recording.2026-01-20.at.3.07.46.PM.mov

Thank you very much for taking the time to review my work and for the detailed feedback.

I’ve now updated the footer to add a background colour and ensured it spans the full width of the page.

When you have a moment, could you please have another look and let me know if everything looks correct now?

Thanks again for your help.

@Elisabeth-Matulian I'm glad you found my comments useful!

I reviewed the footer and see it's now visible ✅ and it's full width ✅. I ran an accessibility report against your page and see a small issue with the contrast ratio of the footer. Can you take a look?

Also, wanted to point out that the 'Read more' buttons on the wireframe have a complete border around them and yours only have an underline.
https://github.com/CodeYourFuture/Module-Onboarding/tree/main/Wireframe
At this point, I'm not going to ask you change that -> but wanted to highlight to ensure in the future that you try to follow the wireframe as closely as possible! ☺️

Thank you for reviewing my updates. I’m glad the previous changes improved the footer.
I’ve noted the accessibility contrast issue and adjusted it. When you have a moment, could you please take another look at my full submission?

…ed files, added back placeholder.svg

take up the entire width of the page

jenny-alexander · 2026-01-22T13:03:22Z

Nicely done @Elisabeth-Matulian!

Working with wareframe

66c88bf

This comment has been minimized.

Sign in to view

Elisabeth-Matulian added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 10, 2026

jenny-alexander self-requested a review January 17, 2026 23:38

jenny-alexander added Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. and removed Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. labels Jan 17, 2026

jenny-alexander reviewed Jan 18, 2026

View reviewed changes

jenny-alexander added Reviewed Volunteer to add when completing a review with trainee action still to take. and removed Review in progress This review is currently being reviewed. This label will be replaced by "Reviewed" soon. labels Jan 18, 2026

Added pics and filled the footer with links.

7cca5f5

Elisabeth-Matulian added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 19, 2026

jenny-alexander reviewed Jan 19, 2026

View reviewed changes

jenny-alexander removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 19, 2026

Align images and links, remove link borders and bullets, deleted unus…

7dbae9f

…ed files, added back placeholder.svg

Elisabeth-Matulian added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 20, 2026

jenny-alexander removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 20, 2026

git commit -m added background color and make footer

b70e461

take up the entire width of the page

Elisabeth-Matulian added the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 21, 2026

jenny-alexander removed the Needs Review Trainee to add when requesting review. PRs without this label will not be reviewed. label Jan 21, 2026

Update footer: set light grey background for better contrast

7dc1e66

jenny-alexander added Complete Volunteer to add when work is complete and all review comments have been addressed. and removed Reviewed Volunteer to add when completing a review with trainee action still to take. labels Jan 22, 2026

Elisabeth-Matulian mentioned this pull request Jan 22, 2026

Jan-26 | Onboarding | Elisabeth Matulian Elisabeth-Matulian/My-Coursework-Planner#24

Open

Uh oh!

Glasgow | Jan-26 | Elisabeth Matulian | Sprint 1 | Wireframe #939

Are you sure you want to change the base?

Glasgow | Jan-26 | Elisabeth Matulian | Sprint 1 | Wireframe #939

Conversation

Elisabeth-Matulian commented Jan 10, 2026

Learners, PR Template

Changelist

Questions

Uh oh!

This comment has been minimized.

netlify bot commented Jan 10, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for cyf-onboarding-module ready!

Uh oh!

jenny-alexander left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jenny-alexander left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jenny-alexander Jan 21, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jenny-alexander commented Jan 22, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

netlify bot commented Jan 10, 2026 •

edited

Loading

jenny-alexander Jan 21, 2026 •

edited

Loading